<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<script type="text/javascript" src="../js/jquery.js"></script>
<script type="text/javascript" src="../js/jquery.scrollTo-min.js"></script>
<script type="text/javascript" src="../js/jquery.scrollShow.js"></script>
<script type="text/javascript">
jQuery(function( $ ){
	//borrowed from jQuery easing plugin
	//http://gsgd.co.uk/sandbox/jquery.easing.php
	$.easing.backout = function(x, t, b, c, d) {
		var s=1.70158;
		return c*((t=t/d-1)*t*((s+1)*t + s) + 1) + b;
	};
	$('#screen').scrollShow({
		view:'#view',
		content:'#images',
		easing:'backout',
		wrappers:'crop',
		navigators:'a[id]',
		navigationMode:'sr',
		circular:true,
		start:0
	});
});
</script>

<div class="header">
  <div class="head_2">
    <div class="block_header">
      <div class="logo"><a href="../index.jsp"><img src="../images/AACP2.png" alt="Home" width="332" height="75" border="0" /></a></div>
      <div class="logo_text">We are a member ACCP2 class<br />
      </div>
      <div class="Simple_text">
        <form action="http://www.baidu.com/baidu" target="_blank">
          <input type="text" name="word" />
          <input type="submit" value="搜索"/>
        </form>
      </div>
      <div class="clr"></div>
    </div>
    <div class="menu">
      <div class="item"> <a class="link icon_mail"></a>
        <div class="item_content">
          <h2><a href="mailto:250347812@qq.com">邮箱</a></h2>
          <br />
          <p><a target="blank" href="http://wpa.qq.com/msgrd?V=1&Uin=250347812&Site=精品空间论坛& Menu=yes"><img border="0" src=http://wpa.qq.com/pa?p=1:250347812:6 alt="点击这里给我发消息" align="middle" /></a> <a href="http://q.t.sina.com.cn/576616" target="_blank">微博</a> <a href="mailto:250347812@qq.com">Email</a> </p>
        </div>
      </div>
      <div class="item"> <a class="link icon_help"></a>
        <div class="item_content">
          <h2>帮助</h2>
          <p> <a href="http://user.qzone.qq.com/250347812/infocenter" target="_blank">管理员</a> <a target="blank" href="http://wpa.qq.com/msgrd?V=1&Uin=282474395&Site=精品空间论坛& Menu=yes">班主任</a><a href="http://zhidao.baidu.com/">百度知道</a> </p>
        </div>
      </div>
      <div class="item"> <a class="link icon_file"></a>
        <div class="item_content">
          <h2><a href="Study.html" target="_new">教学资料</a></h2>
          <br />
          <p> <a href="java.html" target="_blank">java教程</a> <a href="C.html" target="_blank">C# .Net教程</a> <a href="HTML.html" target="_blank">HTML</a><a href="C++.html" target="_blank">C++</a></p>
        </div>
      </div>
      <div class="item"> <a class="link icon_find"></a>
        <div class="item_content">
          <h2>搜索</h2>
          <form action="http://www.baidu.com/baidu" target="_blank">
            <input type="text" name="word"  />
            <input type="submit" value="Go" class="input_w" />
          </form>
        </div>
      </div>
      <div class="item"> <a class="link icon_photos"></a>
        <div class="item_content">
          <h2><a href="photo.html" target="_self">图片</a></h2>
          <br />
          <p> <a href="photo.html" target="_self">班级篮球赛</a> <a href="photo.html" target="_self">校运会</a> <a href="photo.html" target="_self">军训</a> </p>
        </div>
      </div>
      <div class="item"> <a class="link icon_login"></a>
        <div class="item_content">
          <h2><a href="#" >登录</a></h2>
          <br />
          <p> <a href="#">登录</a> <a href="../web/register.html">注册</a> </p>
        </div>
      </div>
      <div class="item"> <a class="link icon_home"></a>
        <div class="item_content">
          <h2><a href="../index.html" target="_blank">主页</a></h2>
          <br />
          <p> <a href="../index.html" target="_blank">主页</a> </p>
        </div>
      </div>
    </div>
    <script type="text/javascript" src="../js/jquery.min.js"></script> 
    <script src="../js/jquery-css-transform.js" type="text/javascript"></script> 
    <script src="../js/jquery-animate-css-rotate-scale.js" type="text/javascript"></script> 
    <script>
            $('.item').hover(
                function(){
                    var $this = $(this);
                    expand($this);
                },
                function(){
                    var $this = $(this);
                    collapse($this);
                }
            );
            function expand($elem){
                var angle = 0;
                var t = setInterval(function () {
                    if(angle == 1440){
                        clearInterval(t);
                        return;
                    }
                    angle += 40;
                    $('.link',$elem).stop().animate({rotate: '+=-40deg'}, 0);
                },10);
                $elem.stop().animate({width:'268px'}, 1000)
                .find('.item_content').fadeIn(400,function(){
                    $(this).find('p').stop(true,true).fadeIn(600);
                });
            }
            function collapse($elem){
                var angle = 1440;
                var t = setInterval(function () {
                    if(angle == 0){
                        clearInterval(t);
                        return;
                    }
                    angle -= 40;
                    $('.link',$elem).stop().animate({rotate: '+=40deg'}, 0);
                },10);
                $elem.stop().animate({width:'52px'}, 1000)
                .find('.item_content').stop(true,true).fadeOut().find('p').stop(true,true).fadeOut();
            }
        </script>
    <div class="text">
      <div class="left_t">ACCP （Aptech Certified Computer Professional）</div>
    </div>
  </div>
</div>
